<style>
    #formorder{padding: 10px 5px 10px 5px;}
    #formorder input,#formorder select{margin: 5px auto;}
    #formorder button{border: 1px solid transparent;background-color: #5bc0de;color: #fff;border-radius: 3px;}
    
    .page{border-top: 1px solid #E0E0E0;padding: 5px;}
    .page .page_count{padding-top: 5px;}
    .page .page_count label{display: inline-block;line-height: 30px;font-weight: normal;float: left;}
    .page .page_count .paginate_button{
        margin: 0 5px;
        float: left;
        background-color: #D5D5D5;
        padding: 5px 12px;
        color: #7d7d7d;
        border-radius: 3px;
    }
    .page .page_count .paginate_button:hover{
        background-color: #89affc;
        color: #fff;
    }
    .page .page_count .paginate_active{
        margin: 0 5px;
        float: left;
        padding: 5px 12px;
        color: #fff;
        background-color: #89affc;
        border-radius: 3px;
    }
    
    .cz_clik a{display: inline-block;background: #89affc;color: #fff;padding: 3px 10px;border-radius: 3px;min-width: 76px;text-align: center;}
    .cz_clik a:hover{background: #89bffc;}
    
    #pop-up-boxes{
        position: fixed;width: 100%;height: 100%;z-index: 20;top: 0;left: 0;display: none;
    }
    #pop-up-boxes-content{
        width: 500px;margin: 0 auto;font-size: 14px;
        border: 1px solid black;color: black;
        margin-top: 10%;background-color: #fff;border-radius: 10px;
    }
    #pop-up-boxes-title img{
        cursor: pointer;float: right;left: 0;top: 17px;width: 16px;height: 16px;margin: 3px;border: none;border-radius: 10px;
    }
    #pop-up-boxes-text{
        padding: 20px;text-align: center;color: #555555;
    }
    #pop-up-boxes-text input,#pop-up-boxes-text select{width: 100px;padding: 3px;}
    #pop-up-boxes-text a{
        display: inline-block;
        text-align: center;
        padding: 5px 10px;
        background-color: #5bc0de;
        color: #fff;
        border-radius: 5px;
    }
    #edit input{border: 1px solid #d3d2d2;}
</style>
<section class="vbox">
    <section class="scrollable padder">
        <ul class="breadcrumb no-border no-radius b-b b-light pull-in">
            <li><a href="#"><i class="fa fa-home"></i>系统管理</a></li>
            <li><a href="#">客房设施</a></li>
            <li><a href="#">客房设施</a></li>
        </ul>
        <div class="m-b-md">
            <h3 class="m-b-none"><span style="float:right;"><a href="#"></a></span>客房设施</h3>
        </div>
        <section class="panel panel-default">
            <header class="panel-heading">
                <i data-title="ajax to load the data." data-placement="bottom" data-toggle="tooltip" class="fa fa-info-sign text-muted" data-original-title="" title=""></i> 
                <b>客房设施</b>
                <a href="javascript:;" onclick="edit(0,'')" style="float: right;border: 1px solid #5bc0de;background: #5bc0de;color: #fff;padding: 2px 5px;border-radius: 3px;">添加客房设施</a>
            </header>
            <table data-ride="datatables" class="table table-striped m-b-none dataTable" id="DataTables_Table_0" >
            <thead>
                <tr role="row">
                    <th>序号</th>
                    <th>名称</th>
                    <th>描述</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
            <?
            if($re){
                foreach($re as $k=>$v){?>
                <tr role="row">
                    <td><?=$k+1?></td>
                    <td><?=$v['title']?></td>
                    <td><?=$v['describes']?></td>
                    <td class="cz_clik">
                        <a href="javascript:;" onclick="edit('<?=$v['id']?>','<?=$v['title']?>','<?=$v['describes']?>')" >修改</a>
                        <a href="javascript:;" class="show_shadefrist" onclick="del('<?=$v['id']?>')" >删除</a>
                    </td>
                </tr>
                <?}
            }else{?>
                <tr><td colspan="10">没有相关内容</td></tr>
            <?}
            ?>
            </tbody>
            </table>
            <div class="page">
                <?=$pageHtml?>
            </div>
        </section>
    </section>
</section>
<a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen" data-target="#nav"></a>
<div id="pop-up-boxes">
    <div id="pop-up-boxes-content">
        <div id="pop-up-boxes-title"><label>&nbsp;设施设备操作</label><img src="/public/assets/sysadmin/mylzp/img/error.png" /></div>
        <div id="pop-up-boxes-text">
            <form class="form-horizontal form-bordered form-validate" action="<?=$this->url("user/edit")?>" method="post" id="edit">
                设施名称：<input type="text" name="title" value="" /><br /><br />
                描&nbsp;&nbsp;述：<input type="text" name="describes" value="" />
                <br /><br />
                <input type="hidden" name="id" value="0" />
                <a href="javascript:void(0);" class="show_shadefrist" onclick="isedit()" >确认操作</a>
            </form>
        </div>
    </div>
</div>
<script type="text/javascript">
$('#pop-up-boxes-title img').click(function(){
    $('#pop-up-boxes').css({'display':'none'});
});
function edit(id,title,describes){
    $('#pop-up-boxes').css({"display":"block"});
    $('#edit input[name="title"]').val(title);
    $('#edit input[name="describes"]').val(describes);
    $('#edit input[name="id"]').val(id);
}
function isedit(){
    if($('#edit input[name="title"]').val()==''){
        pub_alert_error("请填写名称！",2000);
    }else{
        $('#edit').submit();
    }
}
function del(id){
    if(confirm("确定该操作？")){
        $.ajax({
    		type:'POST',
    		url:'<?=$this->url("user/del")?>',
    		data:'id='+id,
    		dataType:'json',
    		success:function(r){
    		    if(r.state==1){
    		        pub_alert_success(r.html,2000);
                    setTimeout(function(){window.location.reload();},2000);
    		    }else if(r.state==0){
    		        pub_alert_error(r.html,2000);
    		    }
    		},
            error:function(){
                pub_alert_error("ajax错误",2000);
            }
    	});
    }
}
</script>